<template>
    <div class="labelCla" :class="{ brfr: isRequ }">
        <slot name="label">
            <span class="label-fon">{{ label }}</span>
            <a-tooltip placement="topLeft" arrow-point-at-center v-if="isShow">
                <template #title>
                    <div v-html="descriptionConfig[prop]" style="white-space: normal;"></div>
                </template>
                <QuestionCircleOutlined style="color: rgb(150, 150, 150)" />
            </a-tooltip>
        </slot>
    </div>
</template>

<script setup>
import descriptionConfig from '@/config/description'
const props = defineProps({
    label: {
        type: String,
        default: ''
    },
    prop: {
        type: String,
        default: ''
    },
    // 是否显示
    isShow: {
        type: Boolean,
        default: true
    },
    // 是否显示必填
    isRequ: {
        type: Boolean,
        default: true
    }
});


</script>
<style lang="less" scoped>
.labelCla {
    padding: 0 0 8px;

    .label-fon {
        margin-right: 10px;
    }
}

.brfr::before {
    display: inline-block;
    margin-right: 4px;
    color: var(--highlight-color);
    font-size: 14px;
    font-family: SimSun, sans-serif;
    line-height: 1;
    content: '*';
}
</style>